<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<style>
    #form {
        width: 640px;
        margin: 20px 200px;
    }


    #table td {
        border: none;
        width: 416px;
    }

    .text {
        text-align: right;
    }

    .table input {
        width: 230px;
    }

    .foot > input {
        margin: 30px 0 0 293px;
        background: cornflowerblue;
        border-radius: 5px;
        height: 30px;
        width: 220px;
    }
</style>
<script src="../asserts/plugins/JQuery/jquery-2.1.1.min.js"></script>
<link href="../asserts/plugins/bootstrap/css/bootstrap.css" rel="stylesheet">


<body style="background-color: #f3fffd;">
<form id="form">
    <input type="hidden" id="action" value="addGoods">
    <table class="table" id="table">
        <tr>
            <td class="text">商品图片：</td>
            <td><input type="file" id="img"></td>
        </tr>

        <tr>
            <td class="text"> 商品名称：</td>
            <td><input type="text" id="name">
                <span id="span1"></span>
            </td>
        </tr>
        <tr>
            <td class="text">商品价格：</td>
            <td><input type="text" id="price">
                <span id="span2"></span></td>
        </tr>
        <tr>
            <td class="text">库存：</td>
            <td><input type="text" id="stock">
                <span id="span3"></span></td>
        </tr>
        <tr>
            <td class="text">商品详情：</td>
            <td><textarea rows="4" cols="29" id="details"></textarea></td>
        </tr>

    </table>
    <div class="foot">
        <input type="button" id="button" value="添加商品">
        <input type="button" id="back" value="返回">
    </div>
</form>
<script>
    $(function () {
        let flag;
        $("#name").blur(function () {
            if ($("#name").val().trim().length == 0) {
                $("#span1").text("商品名不能为空");
                flag = false;
            } else {
                $("#span1").text("")
                flag = true;
            }
        });
        $("#price").blur(function () {
            if ($("#price").val().trim().length == 0) {
                $("#span2").text("价格不能为空");
                flag = false;
            } else {
                $("#span2").text("")
                flag = true;
            }
        });
        $("#stock").blur(function () {
            if ($("#stock").val().trim().length == 0) {
                $("#span3").text("价格不能为空");
                flag = false;
            } else {
                $("#span3").text("")
                flag = true;
            }
        });
        $("#button").click(function () {
            debugger;
            if (flag) {
                let img = $("#img")[0].files[0];
                let name = $("#name").val();
                let price = $("#price").val();
                let stock = $("#stock").val();
                let details = $("#details").val();
                let action = $("#action").val();
                let Formdata = new FormData();
                Formdata.append("img", img);
                Formdata.append("name", name);
                Formdata.append("price", price);
                Formdata.append("stock", stock);
                Formdata.append("details", details);
                Formdata.append("action", action);
                $.ajax({
                    type: 'post',
                    url: '../AdminController',
                    data: Formdata,
                    contentType: false,
                    processData: false,
                    dataType: 'json',
                    success: function (resp) {
                        if (resp.status == 500) {
                            alert(resp.msg);
                        } if(resp.status==200){
                            alert(resp.msg);
                            location.href = 'goodsList.html';
                        }
                    }
                })
            }
        })
    })
</script>
<script>
    $("#back").click(function () {
        history.back();
    })
</script>
</body>
</html>
